<template>
        <div>

        <div>
          <el-page-header @back="goSelling" content="买家个人信息管理页面">
          </el-page-header>
          <el-collapse v-model="activeName" accordion>
        <el-collapse-item title="*个人信息" name="1">
          <div>姓名：想你的夜</div>
          <div>性别：男</div>
        </el-collapse-item>
        <el-collapse-item title="*账户余额" name="2">
          <div>控制反馈：通过界面样式和交互动效让用户可以清晰的感知自己的操作；</div>
          <div>页面反馈：操作后，通过页面元素的变化清晰地展现当前状态。</div>
        </el-collapse-item>
        <el-collapse-item title="*用户ID" name="3">
          <div>简化流程：设计简洁直观的操作流程；</div>
          <div>清晰明确：语言表达清晰且表意明确，让用户快速理解进而作出决策；</div>
          <div>帮助用户识别：界面简单直白，让用户快速识别而非回忆，减少用户记忆负担。</div>
        </el-collapse-item>
        <el-collapse-item title="*地址管理" name="4">
          <div>用户决策：根据场景可给予用户操作建议或安全提示，但不能代替用户进行决策；</div>
          <div>结果可控：用户可以自由的进行操作，包括撤销、回退和终止当前操作等。</div>
        </el-collapse-item>
        <el-collapse-item title="*用户名设置" name="5">
          <div>用户决策：根据场景可给予用户操作建议或安全提示，但不能代替用户进行决策；</div>
          <div>结果可控：用户可以自由的进行操作，包括撤销、回退和终止当前操作等。</div>
        </el-collapse-item>
        <el-collapse-item title="*账户充值" name="6">
          <div>用户决策：根据场景可给予用户操作建议或安全提示，但不能代替用户进行决策；</div>
          <div>结果可控：用户可以自由的进行操作，包括撤销、回退和终止当前操作等。</div>
        </el-collapse-item>
        <el-collapse-item title="*密码修改" name="7">
          <div>用户决策：根据场景可给予用户操作建议或安全提示，但不能代替用户进行决策；</div>
          <div>结果可控：用户可以自由的进行操作，包括撤销、回退和终止当前操作等。</div>
        </el-collapse-item>

      
        
      </el-collapse>
        </div>

     </div> 
</template>

<script>
      export default {
        data() {
          return {
            activeName: '1'
          };
        },
        methods:{
          goSelling(){
            this.$router.push("/Selling");
          }
        }
      }
</script>

<style scoped>
.el-cardcss {
    min-width: 180px;
    margin-right: 20px;
    transition: all .5s;
  }
  

</style>